<template>
	<view :class="'audio-message ' + (isMine ? 'my-audio' : 'my-audio1')" @click="handlePlayAudioMessage">
		<view v-if="isMine" class="audio"  :style="'width: ' + 100 + 'rpx'">
			{{ '" ' + message.payload.second }}</view>
		<image v-if="isMine && !isplay" class="audio-icon"
			src="https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20230526/867371225929ecc0833b539a4306a022.png">
		</image>
		<image v-if="isMine && isplay" class="audio-icon"
			src="https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20230601/5718ca19e0d7da58d99733b14c620404.gif">
		</image>
		<image v-if="!isMine && !isplay" class="audio-icon"
			src="https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20230526/e99417c60e3e74e313c4692a28b53847.png">
		</image>
		<image v-if="!isMine && isplay" class="audio-icon"
			src="https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20230601/30272adb1be32906784d6c7115482347.gif">
		</image>
		<view v-if="!isMine" class="audio1" :style="'width: ' + 100 + 'rpx'">
			{{ message.payload.second+'" ' }}</view>

	</view>
</template>

<script>
	const audio = uni.createInnerAudioContext();
	export default {
		data() {
			return {
				// audio: {},
				isplay: false
			};
		},

		components: {},
		props: {
			message: {
				type: Object,
				default: () => {},
			},
			isMine: {
				type: Boolean,
				default: true,
			}
		},
		watch: {
			message: {
				handler: function(newVal,oldVal) {
					console.log(newVal)
					this.setData({
						message: newVal,
					});
				},
				immediate: true,
				deep: true,
			},
		},
		onUnload() {
			console.log(1111111111222222222221212)
			audio.stop()
			audio.destroy()
		},
		beforeMount() {
			let that=this
			audio.onPlay(() => {
				that.isplay=true
				console.log('开始播放',that.isplay);
			});
			audio.onEnded(() => {
				that.isplay=false
				console.log('停止播放');
			});
			audio.onError(e => {
				console.error(e, 'onError');
				// ios 音频播放无声，可能是因为系统开启了静音模式
				uni.showToast({
					icon: 'none',
					title: '该音频暂不支持播放',
				});
			});
		},

		
		methods: {
			handlePlayAudioMessage() {
				audio.src = this.message.payload.url;
				
				console.error(this.message.payload.second, 'handlePlayAudioMessage');
				audio.play();
				console.log(this.message,this.isplay,123456789)
			},
		},
	};
</script>
<style>
	@import './index.css';
</style>